import { Link } from 'react-router-dom';// 导入React Router的链接组件
import './NotFound.less';
import dragonImage from '../../assets/dragon.png';
import bubbleImage from '../../assets/dragon2.png';

const NotFoundPage = () => {
    return (
        <div className="not-found-container">
            <div className="not-found-content">
                <div className="header-section">
                    <div className="error-code-container">
                        <div className="error-code">404</div>
                        <img src={bubbleImage} alt="Bubble" className="bubble-image" />
                    </div>
                    <img src={dragonImage} alt="dragon" className="dragon-image" />
                </div>

                <h1 className="error-title">科龙向您致歉！</h1>
                <p className="error-message">
                    这个页面已经被我吃掉了，请返回首页吧~
                </p>

                <div className="action-buttons">
                    <Link to="/" className="home-button">
                        返回首页
                    </Link>
                </div>
            </div>
        </div>
    );
};

export default NotFoundPage;